import { MemoryRouter as Router, Routes, Route, Link,HashRouter } from 'react-router-dom';
import { useState, useEffect } from "react";
import { Button } from 'antd';
import Home from './page/home';
import Menu from './components/Menu';
import icon from '../../assets/icon.svg';
import './App.scss';
const  { openFile, setTitle, ipcRenderer, inputPathMinFile } = window.electron;
ipcRenderer.on('rename-complete', () => {
  alert('重命名完成');
});
function Hello() {
  let [text, setText] = useState(0);
  const importFiles = async () => {
    const filePath = await openFile()
    // setTitle('新的title');
    // console.log(filePath);
    if(!filePath){
        return;
    }

    useEffect(()=>{
      ipcRenderer.on('rename-complete', () => {
        alert('重命名完成');
      });
    },[]);

    // ipcRenderer.sendMessage('rename-files', { dirPath:filePath, prefix:'1' , suffix:'1' });
    // window.electron.fileHelper.readFile(filePath).then(value => {
    //   console.log(value);
    //   window.electron.fileHelper.writeFile(filePath, value+'我是新增的东西').then(() => {
        
    //   })
    // })
    // window.electron.getDialog().showOpenDialog({
    //   title: '选择导入的 Markdown 文件',
    //   properties: ['openFile', 'multiSelections'],
    //   filters: [
    //     {name: 'Markdown files', extensions: ['js']}
    //   ]
    // }, (paths:any) => {
    //   if (Array.isArray(paths)) {
    //     // filter out the path we already have in electron store
    //     // ["/Users/liusha/Desktop/name1.md", "/Users/liusha/Desktop/name2.md"]
    //     console.log(paths);
    //   }
    // })
  }
  return (
    <div>
      <div className="Hello">
        <img width="200" alt="icon" src={icon} />
      </div>
      <Button type="primary">Button</Button>
      <h1>electron-react-boilerplate</h1>
      <div>fdfd</div>
      <div className="Hello">
      <input type="text" value={text} onChange={(e)=>{ setText(e.target.value)}} />
      <button type="button" onClick={importFiles}>
        <span role="img" aria-label="books">
          📚
        </span>
        导入
      </button>
      <button
      type="button"
       onClick={ async()=>{
        const result = await inputPathMinFile(text);
       }}
      >
          压缩
      </button>
        {/* <a
          href="https://github.com/sponsors/electron-react-boilerplate"
          target="_blank"
          rel="noreferrer"
        >
          <button type="button">
            <span role="img" aria-label="folded hands">
              🙏
            </span>
            Donate
          </button>
        </a> */}
      </div>
    </div>
  );
}

export default function App() {
  return (
    <div>
      <Router>
        <Menu />
        <Link to="/">主页</Link>
        <Link to="/home">home页面</Link>
        <Routes>
          <Route path="/" element={<Hello />} />
          <Route path="/home" element={<Home />} />
        </Routes>
      </Router>
    </div>
  );
}
